<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>加入购物车</title>
    <link rel="shortcut icon" href="./img/logo.jpg" />
    <link rel="stylesheet" href="./css/common.css">
    <link rel="stylesheet" href="./css/miindex.css">
    <link rel="stylesheet" href="./iconfont/iconfont.css">
    <link rel="stylesheet" href="./css/addCart.css">
</head>
<style>
    header {
        width: 100%;
        display: flex;
        height: 72px;
        background-color: white;
        font-size: 16px;
        position: fixed;
        top: 0;
        border-bottom: 1px solid rgb(218, 218, 218);
        z-index: 10;
    }

    .header_left {
        width: 50%;
        font-weight: bolder;
        display: flex;
        align-items: center;
        justify-content: space-evenly;
        padding-right: 100px;
    }

    .header_left img {
        width: 40px;
        height: 40px;

    }


    .header_menu span {
        font-size: 25px;
        width: 40px;
        height: 40px;
    }

    .header_right {
        padding-right: 80px;
        width: 40%;
        display: flex;
        align-items: center;
        justify-content: space-around;
    }

    .header_right span {
        font-size: 22px;
    }

    .header_right input {
        width: 260px;
        height: 40px;
        text-indent: 0;
        /* height: 100%; */
        background-color: transparent;
        padding-left: 5px;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        /* border-style: none; */
        border: 1px solid gray;
        background-color: white;
    }


    .search {
        display: flex;
        justify-content: left;
        align-items: center;
        /* border-collapse: collapse; */
    }

    .header_right .search_a {
        display: block;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 22px;
        width: 40px;
        height: 40px;
        border: 1px solid rgb(218, 218, 218);
        border-left: 0;
    }
</style>

<body>
    <header>
        <div class="header_left">
            <a href="index.html"><img src="./img/logo.jpg" alt=""></a>
            <span class="women">手机</span>
            <span class="men">电脑</span>
            <span class="child">平板</span>
            <span class="infant">智能设备</span>
        </div>
        <div class="header_right">
            <div class="search">
                <input type="text" placeholder="搜索商品">
                <span class="iconfont search_a">&#xe651;</span>

            </div>
            <span class="iconfont">&#xe62f;</span>
            <span class="iconfont">&#xe638;</span>
            <span class="iconfont">&#xe6de;</span>
            <span class="iconfont">&#xe631;</span>

        </div>

    </header>
    <main>
        <div class="top">
            <!-- 左侧 -->
            <div class="left">
                <div class="success"><img src="./img/success.png" alt=""></div>
                <div class="text">
                    <p class="successText">已成功加入购物车！</p>
                    <span class="goodsName" >小米18手机</span>
                </div>
            </div>
            <div class="right">
                <button class="return">返回上一级</button>
                <a class="clearCart">
                    <button class="clear">去购物车结算</button>
                </a>
            </div>
        </div>
    </main>
</body>
<script src="./js/common.js"></script>
<script src="./js/addCart.js"></script>

<script>
  
</script>

</html>